<template>
  <div class="search-songs">
    <SongListContent :listOfSong="listOfSong"></SongListContent>
  </div>
</template>

<script>
import SongListContent from "@/components/SongListContent";
export default {
  name: "SearchSong",
  components:{
    SongListContent
  },
  data(){
    return{
      listOfSong:[]
    }
  },
  methods:{
    //获取歌曲
   async getSong(){
       if (!this.$route.query.keyWords){
         this.$notify({
           title: '警告',
           message: '你未输入歌曲',
           type: 'warning'
         })
       }else {
        let result=await this.$API.reqShowByName(this.$route.query.keyWords)
         if (result.code==10000){
           this.listOfSong=result.data
           this.$bus.$emit('listOfSong',result.data)
         }else{
           this.$notify({
             title: '警告',
             message: '暂时没有该歌曲',
             type: 'warning'
           })
          await  Promise.reject(new Error('fail'))
         }
       }
    }
  },
  mounted() {
    this.getSong()
  }
}
</script>

<style lang="scss" scoped>
@import 'src/assets/css/search-songs.scss';
</style>
